<template>
	<view class="drugOrderInfo-wrap" v-if="orderInfo">
		<view class="drugOrderInfo-address">
			<u-title value="收货地址"></u-title>

			<view class="drugOrderInfo-address-info" @click="gotoRouter('/pages-member/addressList/addressList?type=1')">
				<view class="drugOrderInfo-address-item">
					<view  class="word3">收货人：{{ orderShipping.receiverName }}&nbsp;&nbsp;{{ orderShipping.receiverPhone }}</view>
					<view  class="txt1 ">收货地址：{{orderShipping.receiverProvince!=orderShipping.receiverCity?orderShipping.receiverProvince:''}}{{orderShipping.receiverCity}}{{orderShipping.receiverDistrict}} {{ orderShipping.receiverAddress }}</view>
				</view>
			</view>
		</view>

		<view class="drugOrderInfo-Rp">
			<u-title value="药品信息"></u-title>
			<view class="prescInfo-drug-list"><u-show-goods v-for="(data, inde) in orderInfo.commodityDetailList" :data="data" :key="index" type="0"></u-show-goods></view>
		</view>

		<view class="drugOrderInfo-patient">
			<u-title value="订单信息"></u-title>
			<view class="drugOrderInfo-patient-box">
				<view class="drugOrderInfo-patient-outer">
					<text lines="1" class="word10">订单编号：{{ orderInfo.outTradeNo }}</text>
					<view class="word-btn" @click="setClipboardData(orderInfo.outTradeNo)">复制</view>
				</view>
				<view class="drugOrderInfo-patient-outer">
					<text lines="1" class="word10">下单时间：{{ orderInfo.orderTime }}</text>
				</view>
				<view class="drugOrderInfo-patient-outer">
					<text lines="1" class="word10">订单金额：{{ orderInfo.orderAmount }} 元</text>
				</view>
			</view>
		</view>

		<view class="drugOrderInfo-logistics" v-if="logistics">
			<u-title value="物流信息"></u-title>
			<view class="drugOrderInfo-logistics-item" v-for="(item,index) in logistics" :key="index" >
				<view  class="word4">{{item.context}}</view>
				<view  class="info1">{{item.ftime}}</view>
			</view>
			
		</view>

		<u-bottom-button type="3" value1="取消订单" value2="立即支付" @clickOne="clearOrder" @clickTwo="submitOrder" v-if="orderInfo.status == 3"></u-bottom-button>
		<u-bottom-button type="3" value2="确认收货" @clickTwo="confirmOrder" v-if="orderInfo.status == 8"></u-bottom-button>
	</view>
</template>

<script>
import uTitle from '@/components/u-title/u-title.vue';
import uBottomButton from '@/components/u-bottom-button/u-bottom-button.vue';
import uShowGoods from '@/components/u-show-goods/u-show-goods.vue';
export default {
	components: {
		uBottomButton,
		uTitle,
		uShowGoods
	},
	data() {
		return {
			id: null,
			orderInfo: null,
			orderShipping:null,
			totalPrice: 0,
			payFlag: true,
			logistics: null
		};
	},
	onLoad(options) {
		this.id = options.id;
		this.queryOrderDetail();
		this.orderTack();
	},

	onShow() {}, 
	methods: {
		//订单物流查询
		orderTack() {
			this.$api
				.orderTack({
					params: {
						id: this.id
					}
				})
				.then(res => {
					if (res.code == 200 && res.result.data) {
						this.logistics = res.result.data;
					} 
				});
		},

		//订单
		queryOrderDetail() {
			this.$api
				.queryOrderDetail({
					params: {
						id: this.id
					}
				})
				.then(res => {
					if (res.code == 200) {
						this.orderInfo = res.result;
						this.orderShipping = res.result.orderShipping;
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none'
						});
					}
				});
		},

		//确认收货
		confirmOrder() {
			uni.showModal({
				title: '您确认要收货吗？',
				success: res => {
					if (res.confirm) {
						this.updateOrderStatus(10);
					}
				}
			});
		},

		//取消订单
		clearOrder() {
			uni.showModal({
				title: '确认要取消该订单吗？',
				success: res => {
					if (res.confirm) {
						this.updateOrderStatus(6);
					}
				}
			});
		},

		//修改订单状态
		updateOrderStatus(status) {
			this.$api
				.updateOrderStatus({
					params: {
						orderId: this.id,
						status: status
					}
				})
				.then(res => {
					if (res.code == 200) {
						this.queryOrderDetail();
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none'
						});
					}
				});
		},

		//发起微信支付
		submitOrder() {
			if (this.payFlag) {
				this.payFlag = false;
				this.$api
					.submitOrder({
						params: {
							commodityName: '购药订单',
							orderId: this.id
						}
					})
					.then(res => {
						if (res.code == 200) {
							this.wxRequestPayment(res.result);
						} else {
							uni.showToast({
								title: res.message,
								icon: 'none'
							});
						}
					});
			}
		},

		//微信小程序拉起支付
		wxRequestPayment(res) {
			wx.requestPayment({
				timeStamp: res.timeStamp,
				nonceStr: res.nonceStr,
				package: res.packageValue,
				signType: res.signType,
				paySign: res.paySign,
				success: success => {
					uni.showToast({
						title: '支付成功',
						icon: 'none'
					});
					this.queryOrderDetail();
				},
				fail: error => {
					uni.showToast({
						title: '取消支付',
						icon: 'none'
					});
				},
				complete: () => {
					this.payFlag = true;
				}
			});
		}
	}
};
</script>

<style lang="less">
@import './drugOrderInfo.less';
</style>
